<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="./axios.min.js"></script>
  </head>
  <body>
    <h1>登录</h1>
    <input type="text" name="" id="username" /> <span></span>
    <br />
    <input type="text" name="" id="password" /> <span></span>
    <br />

    <input type="button" name="" id="btn" value="登录" />

    <script>
      let usernameIpt = document.querySelector("#username");
      let passwordIpt = document.querySelector("#password");
      let btn = document.querySelector("#btn");
      let isUsername = false;
      usernameIpt.onchange = function () {
        let reg = /1/;
        // let reg = /^1[3-9]\d{9}$/;
        if (reg.test(this.value)) {
          isUsername = true;
        } else {
          isUsername = false;
        }
      };

      let isPassword = false;
      passwordIpt.onchange = function () {
        let reg = /^.{3,}$/;
        // let reg = /^1[3-9]\d{9}$/;
        if (reg.test(this.value)) {
          isPassword = true;
        } else {
          isPassword = false;
        }
      };

      btn.onclick = function () {
        if (isUsername && isPassword) {
          /* 
           接口地址：http://jx.xuzhixiang.top/ap/api/login.php
     接口请求方式：get
     接口参数：
          username用户名
          password密码
          
          */
          let loginAPI = "http://jx.xuzhixiang.top/ap/api/login.php";
          let params = {
            username: usernameIpt.value,
            password: passwordIpt.value,
          };
          axios.get(loginAPI, { params }).then((res) => {
            console.log(res.data);
            alert(res.data.msg);
            if (res.data.code == 1) {
              // 加密的 密码 - （登录的凭证）
              // 登录的时候 把用户信息保存到本地 ，方便在其他页面使用
              // token: "0f8aef2fcc906a921540fec3afbd8738"
              localStorage.setItem("token", res.data.data.token);
              localStorage.setItem("id", res.data.data.id);
              localStorage.setItem("username", res.data.data.username);
              location.href = "index.html";
            }
          });
        } else {
          alert("请检查格式");
        }
      };
    </script>
  </body>
</html>
